<!doctype html>
<html lang="zh-CN">
<head>
    {% load static %}
    <!-- 必须的 meta 标签 -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Bootstrap 的 CSS 文件 -->
    <link href="{% static  'bootsrap/css/bootstrap.min.css' %}" rel="stylesheet">
    <script src="{% static 'bootsrap/js/bootstrap.bundle.min.js' %}"></script>

    <title>在线学习系统</title>
    <link rel="icon" href="{% static 'img/tubiao.jpg' %}" type="image/x-icon">


    <style type="text/css">

    </style>
    {% load static %}
</head>

<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container-fluid">
        <a class="navbar-brand" href="/">
            <img src="{% static '/img/tubiao.jpg' %}" alt="" width="30" height="30">
            在线学习系统
        </a>
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarScroll"
                aria-controls="navbarScroll" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarScroll">
            <ul class="navbar-nav me-auto my-2 my-lg-0 navbar-nav-scroll" style="--bs-scroll-height: 100px;">


            </ul>
            {% if request.session.name %}
                <ul class="navbar-nav  d-flex dropdown" style="--bs-scroll-height: 100px;margin-right: 30px">


                    <a class="nav-link dropdown-toggle" href="#" id="navbarScrollingDropdown" role="button"
                       data-bs-toggle="dropdown" aria-expanded="false">
                        欢迎您:{{ request.session.name }}
                    </a>
                    <ul class="dropdown-menu" aria-labelledby="navbarScrollingDropdown">
                        {% if request.session.type == 3 %}
                            <li><a class="dropdown-item" href="{% url 'teachers_index' %}">切换教师端</a></li>
                        {% elif request.session.type == 6 %}
                            <li><a class="dropdown-item" href="{% url 'myadmin_index' %}">切换后台管理端</a></li>
                        {% elif  request.session.type == 1 %}
                            <li><a class="dropdown-item" href="{% url 'teachers_register' %}">审核教师</a></li>
                        {% elif  request.session.type == 4 %}
                            <li><a class="dropdown-item" href="{% url 'teachers_register' %}">提交教师审核</a></li>
                        {% endif %}

                        <li><a class="dropdown-item" href="#">编辑资料</a></li>
                        <li><a class="dropdown-item" href="{% url 'pswd_edit' %}">修改密码</a></li>
                        <li><a class="dropdown-item" href="/logout/">退出登录</a></li>

                    </ul>
                </ul>
            {% else %}
                <ul class="navbar-nav   d-flex" style="--bs-scroll-height: 100px;">

                    <li class="nav-item">

                        <a class="nav-link active " href="/login/">
                            登录/注册
                        </a>
                    </li>
                </ul>
            {% endif %}
            
            {#      <form class="d-flex">#}
            {#        <input class="form-control me-2" type="search" placeholder="Search" aria-label="Search">#}
            {#        <button class="btn btn-outline-success" type="submit">Search</button>#}
            {#      </form>#}
        </div>
    </div>
</nav>
<div>
    <div id="carouselExampleDark" class="carousel carousel-dark slide" data-bs-ride="carousel">
        <div class="carousel-indicators">
            <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="0" class="active"
                    aria-current="true" aria-label="Slide 1"></button>
            <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="1"
                    aria-label="Slide 2"></button>
            <button type="button" data-bs-target="#carouselExampleDark" data-bs-slide-to="2"
                    aria-label="Slide 3"></button>
        </div>
        <div class="carousel-inner">
            <div class="carousel-item active" data-bs-interval="10000">
                <img src="{% static 'img/1024.jpg' %}" class="d-block w-100" alt="...">
                <div class="carousel-caption d-none d-md-block">
                    <h5>在线学习系统</h5>
                    <p>欢迎您来到我的在线学习系统</p>
                </div>
            </div>
            <div class="carousel-item" data-bs-interval="2000">
                <img src="{% static 'img/1024.jpg' %}" class="d-block w-100" alt="...">
                <div class="carousel-caption d-none d-md-block">
                    <h5>在线学习系统</h5>
                    <p>欢迎您来到我的在线学习系统</p>
                </div>
            </div>
            <div class="carousel-item">
                <img src="{% static 'img/1024.jpg' %}" class="d-block w-100" alt="...">
                <div class="carousel-caption d-none d-md-block">
                    <h5>在线学习系统</h5>
                    <p>欢迎您来到我的在线学习系统</p>
                </div>
            </div>
        </div>
        <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleDark"
                data-bs-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Previous</span>
        </button>
        <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleDark"
                data-bs-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Next</span>
        </button>
    </div>
</div>
<br>
<br>
{#课程显示#}
<div class="container">
    <div class="row">
        <h3>&emsp;&emsp;推荐课程</h3>
        <hr>
        {% load static %}
        {% for i in cource %}
            <a href="{% url 'students_kecheng_add' i.id %}" class="col col-auto" style="margin-bottom: 30px;background-color: rgba(0,0,0,0.04);
                                            margin-top: 5px;
                                            text-decoration: none;
                                            color: black;
margin-left: 15px">
                <div class="card" style="width: 15rem;">
                    <img src="/static/media/{{ i.photo }}" class="card-img-top" alt="{{ i.photo }}">
                    <div class="card-body">
                        <b>&emsp;{{ i.name }}</b>
                        <p class="card-text">{{ i.introduction |  slice:":60" }}....</p>
                    </div>
                </div>
            </a>
        {% endfor %}


    </div>
</div>

</body>


</html>